<div class="ivu-form ivu-form-label-right">​​​​​​​
  <!--脚本将会混入表单自定义表单控件-->
  <script>
    window.custFormComponentMixin = {
      data: function () {
        return { "test": "helloWorld", dataSon: [], ceshi: "", productPath: "" };
      },
      mounted: function () {
        var rwid = location.search.replace("?", "")
        var name = decodeURIComponent(rwid)
        var nameList = name.split("&")
        var ids = nameList[0].split("taskId=")[1]
        $(".list_rom a:last").remove()
        $(".list_rom2 a:last").remove()
        $(".list_rom3 a:last").remove()
        $(".list_rom4 a:last").remove()
        console.log("dada", this.data)
        var that = this
        var url = __ctx + "/sys/aclclb/ById/" + that.data.a_cl_cllr2.id
        var post = Vue.baseService.get(url);
        post.then(function (data) {
          that.productPath = data.cplj1 + " / " + data.cplj2 + " / " + data.cplj3 + " / " + data.cplj4

          console.log("==>>", data)

        }, function (status) {
          if (status == !0) {
            layer.close(loading)
            $.Toast.error('加载失败！' + status);
          }
        })

        this.data.a_cl_cllr2.supplierid = sessionStorage.chanpinid


      },
      created: function () {


      }, methods: {
        testaaa: function () { alert(1) },
        getValue: function (e) {

          var even = e.target.value

          var that = this
          var url = __ctx + "/sys/clcsb/getinfo/" + even
          var post = Vue.baseService.post(url);
          post.then(function (data) {

            var newData = data
            console.log("faso==>>", newData.data)
            that.dataSon = newData.data
            let obj = {};
            if (that.dataSon != undefined) {
              that.dataSon.map(item => {
                obj = item;
                obj['csm'] = item['parameterName'];
                obj['csz'] = item['parameterValue'];
                delete obj['parameterName'];
                delete obj['parameterValue'];
                that.dataSon.push(obj)
              })
            }

            that.data.a_cl_cllr2.clcsbList = that.dataSon
          }, function (status) {
            if (status == !0) {
              layer.close(loading)
              $.Toast.error('加载失败！' + status);
            }
          })

        }
      }, watch: {
        "data.a_cl_cllr2.cplj1": function (newVal) {
          //this.data.a_cl_cllr2.cplj2 = this.abCustQueryOpMap.op2[0].ckey


          var arr2 = JSON.parse(JSON.stringify(this.abCustQueryOpMap.op1))


          this.data.a_cl_cllr2.wlbm = newVal;

        },
        "data.a_cl_cllr2.cplj2": function (newVal) {

          this.data.a_cl_cllr2.wlbm = newVal;

        },
        "data.a_cl_cllr2.cplj3": function (newVal) {

          this.data.a_cl_cllr2.wlbm = newVal;
        },
        "data.a_cl_cllr2.cplj4": function (newVal) {

          this.data.a_cl_cllr2.wlbm = newVal;
        },
        "data.a_cl_cllr2.pp": function (newVal) {
          if (this.data.a_cl_cllr2.hpxl == undefined) {
            this.data.a_cl_cllr2.cpmc = newVal + ""

          } else {
            this.data.a_cl_cllr2.cpmc = newVal + this.data.a_cl_cllr2.hpxl;
          }

        },
        "data.a_cl_cllr2.hpxl": function (newVal) {
          if (this.data.a_cl_cllr2.pp == undefined) {
            this.data.a_cl_cllr2.cpmc = newVal + ""

          } else {
            this.data.a_cl_cllr2.cpmc = this.data.a_cl_cllr2.pp + newVal;
          }


        }
      }
    }
  </script>
  ​
  <table class="form-table" style="margin: 0 auto;" border="1" data-sort="sortDisabled">
    <tbody>

      <tr class="firstRow">

        <th>产品路径</th>
        <td colspan="9" style="word-break: break-all;">
          <input disabled="disabled" type="text" class=" form-control" v-model="productPath">
          <div style="display: none;">
            <select id="text" @change="getValue($event)" style="width: 80px;" class=" form-control"
              v-model="data.a_cl_cllr2.cplj1" v-ab-permission="permission.a_cl_cllr2.a_cl_clb.cplj1" desc="材料表-产品路径"
              v-ab-validate="{&quot;maxlength&quot;:255}" v-ab-cust-query="abCustQueryOpMap.op0" dialog-key="wlbm2"
              :param="{}"
              :init-param="{&quot;pkey&quot;:&quot;0&quot;,&quot;ckey&quot;:&quot;01,02,03,04,05,06,07,08,09,10,11,12&quot;}"
              op-val="ckey" op-txt="cname" disabled="disabled">
              <option v-for="item in abCustQueryOpMap.op0" :value="item.ckey">{{item.cname}}</option>
            </select>
            ​<span style="font-size: 20px;padding: 0 3px;">-</span>
            <select style="width: 80px;" class=" form-control" v-model="data.a_cl_cllr2.cplj2"
              v-ab-permission="permission.a_cl_cllr2.a_cl_clb.cplj2" desc="材料表-产品路径2"
              v-ab-validate="{&quot;maxlength&quot;:255}" v-ab-cust-query="abCustQueryOpMap.op1" dialog-key="wlbm2"
              :param="{pkey:data.a_cl_cllr2.cplj1}" :init-param="{&quot;pkey&quot;:&quot;x&quot;}" op-val="ckey"
              op-txt="cname" disabled="disabled">
              <option v-for="item in abCustQueryOpMap.op1" :value="item.ckey">{{item.cname}}</option>
            </select>
            <span style="font-size: 20px;">-</span>
            <select @change="getValue($event)" style="width: 80px;" class=" form-control"
              v-model="data.a_cl_cllr2.cplj3" v-ab-permission="permission.a_cl_cllr2.a_cl_clb.cplj3" desc="材料表-产品路径3"
              v-ab-validate="{&quot;maxlength&quot;:255}" v-ab-cust-query="abCustQueryOpMap.op2" dialog-key="wlbm2"
              :param="{pkey:data.a_cl_cllr2.cplj2}" :init-param="{&quot;pkey&quot;:&quot;x&quot;}" op-val="ckey"
              op-txt="cname" disabled="disabled">

              <option v-for="item in abCustQueryOpMap.op2" :value="item.ckey">{{item.cname}}</option>
            </select>

            <span style="font-size: 20px;">-</span>
            <select @change="getValue($event)" style="width: 80px;" class=" form-control"
              v-model="data.a_cl_cllr2.cplj4" v-ab-permission="permission.a_cl_cllr2.a_cl_clb.cplj4" desc="材料表-产品路径4"
              v-ab-validate="{&quot;maxlength&quot;:255}" v-ab-cust-query="abCustQueryOpMap.op3" dialog-key="wlbm2"
              :param="{pkey:data.a_cl_cllr2.cplj3}" :init-param="{&quot;pkey&quot;:&quot;x&quot;}" op-val="ckey"
              op-txt="cname" disabled="disabled">

              <option v-for="item in abCustQueryOpMap.op3" :value="item.ckey">{{item.cname}}</option>
            </select>
          </div>


        </td>
      </tr>
      <tr>
        <th>品牌</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.pp"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.pp" desc="材料表-品牌"
            v-ab-validate="{&quot;maxlength&quot;:255,&quot;required&quot;:true}" disabled="disabled"></td>
      </tr>
      <tr>
        <th>货品系列</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.hpxl"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.hpxl" desc="材料表-货品系列"
            v-ab-validate="{&quot;maxlength&quot;:255,&quot;required&quot;:true}" disabled="disabled"></td>
      </tr>

      <tr>
        <th>物料编码</th>
        <td colspan="9">
          <input type="text" class=" form-control" v-model="data.a_cl_cllr2.wlbm"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.wlbm" desc="材料表-物料编码"
            v-ab-validate="{&quot;maxlength&quot;:255,&quot;required&quot;:true}" disabled="disabled">
        </td>
      </tr>
      <tr>
        <th>产品名称</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.cpmc"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.cpmc" desc="材料表-产品名称"
            v-ab-validate="{&quot;maxlength&quot;:255,&quot;required&quot;:true}" disabled="disabled"></td>
      </tr>

      <tr>
        <th>产品型号</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.cpxh"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.cpxh" desc="材料表-产品型号"
            v-ab-validate="{&quot;maxlength&quot;:255,&quot;required&quot;:true}" disabled="disabled"></td>
      </tr>
      <tr>
        <th>样品照片</th>
        <td colspan="9">
          <div class="list_rom">
            <ab-upload
              style="color: #ccc;padding:0;line-height: 100px;font-size: 20px; width: 100px;height:100px;border: 1px dashed #ccc; bordrr-radius: 5px;"
              href="javascript:void(0)" class=" btn fa fa-plus" v-model="data.a_cl_cllr2.ypzp"
              :ab-permission="permission.a_cl_cllr2.a_cl_clb.ypzp" desc="材料表-样品照片" disabled="disabled"></ab-upload>
          </div>

        </td>
      </tr>
      <tr>
        <th>规格/尺寸</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.ggcc"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.ggcc" desc="材料表-规格/尺寸"
            v-ab-validate="{&quot;maxlength&quot;:50,&quot;required&quot;:true}" disabled="disabled"></td>
      </tr>
      <tr>
        <th>单位</th>
        <td colspan="9">
          <ab-dict type="text" class=" input-div" v-model="data.a_cl_cllr2.dw1"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.dw1" desc="材料表-单位1"
            v-ab-validate="{&quot;maxlength&quot;:50}" dict-key="dw" disabled="disabled"></ab-dict>
        </td>
      </tr>
      <tr>
        <th>市场价</th>
        <td colspan="4"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.scj"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.scj" desc="材料表-市场价"
            v-ab-validate="{&quot;number&quot;:true,&quot;maxlength&quot;:10}" disabled="disabled"></td>
        <td style="width:40px">单位</td>
        <td colspan="4">
          <ab-dict style="width:66px" type="text" class=" input-div" v-model="data.a_cl_cllr2.scjdw"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.scjdw" desc="材料表-市场价单位"
            v-ab-validate="{&quot;maxlength&quot;:50}" dict-key="dw" disabled="disabled">
          </ab-dict>
        </td>
      </tr>
      <tr>
        <th rowspan="2">工程价</th>
        <td style="width:40px">区间</td>
        <td style="width: 250px;">
          <input style="width: 40%;" type="text" class=" form-control" v-model="data.a_cl_cllr2.gcj10"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcj10" desc="材料表-工程价1"
            v-ab-validate="{&quot;maxlength&quot;:50,&quot;required&quot;:true}" disabled="disabled">~
          <input style="width: 40%;" type="text" class=" form-control" v-model="data.a_cl_cllr2.gcj11"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcj11" desc="材料表-工程价1"
            v-ab-validate="{&quot;maxlength&quot;:50,&quot;required&quot;:true}" disabled="disabled">
        </td>
        <td style="width: 250px;">
          <input style="width: 40%;" type="text" class=" form-control" v-model="data.a_cl_cllr2.gcj20"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcj20" desc="材料表-工程价2" disabled="disabled">~
          <input style="width: 40%;" type="text" class=" form-control" v-model="data.a_cl_cllr2.gcj21"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcj21" desc="材料表-工程价2" disabled="disabled">

        </td>
        <td style="width: 250px;">
          <input style="width: 40%;" type="text" class=" form-control" v-model="data.a_cl_cllr2.gcj30"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcj30" desc="材料表-工程价3" disabled="disabled">~
          <input style="width: 40%;" type="text" class=" form-control" v-model="data.a_cl_cllr2.gcj31"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcj31" desc="材料表-工程价3" disabled="disabled">
        </td>
        <td style="width:40px">单位</td>
        <td colspan="4">
          <ab-dict style="width:66px" type="text" class=" input-div" v-model="data.a_cl_cllr2.gcjdw"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcjdw" desc="材料表-工程价单位"
            v-ab-validate="{&quot;maxlength&quot;:50}" dict-key="dw" disabled="disabled"></ab-dict>
        </td>
      </tr>
      <tr>
        <td style="width:40px">价格</td>
        <td style="width: 250px;"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.gcjg1"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcjg1" desc="材料表-工程价格1"
            v-ab-validate="{&quot;maxlength&quot;:10,&quot;required&quot;:true}" disabled="disabled"></td>
        <td style="width: 250px;"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.gcjg2"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcjg2" desc="材料表-工程价格2"
            v-ab-validate="{&quot;number&quot;:true,&quot;maxlength&quot;:10}" disabled="disabled"></td>
        <td><input type="text" class=" form-control" v-model="data.a_cl_cllr2.gcjg3"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcjg3" desc="材料表-工程价格3"
            v-ab-validate="{&quot;number&quot;:true,&quot;maxlength&quot;:10}" disabled="disabled"></td>
        <td style="width:40px">单位</td>
        <td colspan="4">
          <ab-dict style="width:66px" type="text" class=" input-div" v-model="data.a_cl_cllr2.gcdw"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gcdw" desc="材料表-工程单位"
            v-ab-validate="{&quot;maxlength&quot;:50}" dict-key="dw" disabled="disabled"></ab-dict>
        </td>

      </tr>
      <tr>
        <th>货期</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.shipmentdate"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.shipmentdate" desc="材料表-货期"
            v-ab-validate="{&quot;maxlength&quot;:255}" disabled="disabled"></td>
      </tr>
      <tr>
        <th>产地</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.place"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.place" desc="材料表-产地"
            v-ab-validate="{&quot;maxlength&quot;:255}" disabled="disabled"></td>
      </tr>
      <tr>
        <th>主要技术参数</th>
        <td colspan="9">
          <div id="a_cl_cllr2-clcsb" table-key="clcsb" v-ab-permission:show="tablePermission.a_cl_cllr2.clcsb">
            <div>
              <div style="margin-left: 30px; border-top: 0; display: none;" class="ibox-title"><span
                  class="title"></span>
                <ab-sub-add href="javascript:void(0)" class="btn btn-primary btn-sm fa fa-plus"
                  v-model="data.a_cl_cllr2.clcsbList" v-bind:init-data="initData.a_cl_cllr2.clcsb"
                  v-ab-permission:edit="tablePermission.a_cl_cllr2.clcsb">添加 </ab-sub-add>
                <div style="display:none;">
                  <ab-sub-imp href="javascript:void(0)" class="btn btn-primary btn-sm fa fa-download"
                    v-model="data.a_cl_cllr2.clcsbList" table-key="clcsb"
                    v-ab-permission:edit="tablePermission.a_cl_cllr2.clcsb">导入 </ab-sub-imp>
                  <ab-sub-exp href="javascript:void(0)" class="btn btn-primary btn-sm fa fa-upload"
                    v-model="data.a_cl_cllr2.clcsbList" table-key="clcsb"
                    v-ab-permission:edit="tablePermission.a_cl_cllr2.clcsb" style="display:none;">导出 </ab-sub-exp>
                </div>

              </div>
              <ab-sub-scope v-slot="scope" :permissiona="permission" :table-permissiona="tablePermission"
                v-for="(clcsb,index) in data.a_cl_cllr2.clcsbList">
                <ab-sub-del style="margin-top: 14px" href="javascript:void(0);" v-model="data.a_cl_cllr2.clcsbList"
                  v-bind:index="index" class="btn btn-danger btn-xs fa fa-delete pull-right"
                  v-ab-permission:edit="scope.tablePermission.a_cl_cllr2.clcsb">移除</ab-sub-del>
                <table class="form-table" style="margin-left: 0;">
                  <tbody>
                    <tr class="firstRow">
                      <th>参数名</th>
                      <td><input disabled="disabled" type="text" class=" form-control" v-model="clcsb.csm"
                          v-ab-permission="scope.permission.a_cl_cllr2.clcsb.csm" desc="材料参数表-参数名"
                          v-ab-validate="{&quot;maxlength&quot;:50}"></td>
                      <th>参数值</th>
                      <td><input type="text" class=" form-control" v-model="clcsb.csz"
                          v-ab-permission="scope.permission.a_cl_cllr2.clcsb.csz" desc="材料参数表-参数值"
                          v-ab-validate="{&quot;maxlength&quot;:50}" disabled="disabled"></td>
                    </tr>
                  </tbody>
                </table>

              </ab-sub-scope>
            </div>
          </div>
        </td>
      </tr>
      <tr>
        <th>产品手册</th>
        <td colspan="9">
          <div class="list_rom2">
            <ab-upload href="javascript:void(0)" class=" btn btn-primary fa-upload" v-model="data.a_cl_cllr2.cpsc"
              :ab-permission="permission.a_cl_cllr2.a_cl_clb.cpsc" desc="材料表-产品手册" disabled="disabled"></ab-upload>
          </div>

        </td>
      </tr>
      <tr>
        <th>安装工艺</th>
        <td colspan="9">
          <div class="list_rom3">
            <ab-upload href="javascript:void(0)" class=" btn btn-primary fa-upload" v-model="data.a_cl_cllr2.azgy"
              :ab-permission="permission.a_cl_cllr2.a_cl_clb.azgy" desc="材料表-安装工艺" disabled="disabled"></ab-upload>
          </div>

        </td>
      </tr>
      <tr>
        <th>监测报告</th>
        <td colspan="9">
          <div class="list_rom4">
            <ab-upload href="javascript:void(0)" class=" btn btn-primary fa-upload" v-model="data.a_cl_cllr2.jcbg"
              :ab-permission="permission.a_cl_cllr2.a_cl_clb.jcbg" desc="材料表-检测报告" disabled="disabled"></ab-upload>
          </div>

        </td>
      </tr>
      <tr>
        <th>官网网址</th>
        <td colspan="9"><input type="text" class=" form-control" v-model="data.a_cl_cllr2.gwwz"
            v-ab-permission="permission.a_cl_cllr2.a_cl_clb.gwwz" desc="材料表-官网/网址"
            v-ab-validate="{&quot;maxlength&quot;:50}" disabled="disabled">​</td>
      </tr>
      <input type="hidden" class=" form-control" v-model="data.a_cl_cllr2.company_id"
        v-ab-permission="permission.a_cl_cllr2.a_cl_clb.company_id" desc="材料表-供应商id"
        v-ab-validate="{&quot;maxlength&quot;:50}">
    </tbody>
  </table>


</div>